<template>
	<div id="list">
		article list
		<ul>
			<li v-for="a in articles">
				{{a.id}} - {{a.title}} 
				<button 
					:disabled="!a.enabled"
					@click="addToHistory(a)"
				>add to history</button>
			</li>
		</ul>
	</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'

export default {
	name: 'articleList',
	computed: {
		...mapGetters({
			articles: 'allArticles'
		})
	},
	methods: {
		...mapActions(['addToHistory'])
	},
	created() {
		this.$store.dispatch('getAllArticles', { page: 1})
	}
}
</script>